import { defineComponent } from 'vue';
import Imports from './components/Imports.vue';
import Exports from './components/Exports';
import Previews from './components/Previews';
import Aligns from './components/Aligns';
import Scales from './components/Scales';
// import Commands from './components/Commands';
// import ExternalTools from './components/ExternalTools';

const Toolbar = defineComponent({
  name: 'ToolBar',
  setup() {
    return () => (
      <div class="toolbar">
        <div class="hl-inner">
          <Aligns />
          <Scales />
        </div>
        <div className="hl-outer">
          <Imports />
          <Exports />
          <Previews />
        </div>
        {/* <Commands /> */}
        {/* <ExternalTools /> */}
      </div>
    );
  },
});

export default Toolbar;
